<template>
	<view class="container">
		<!-- 获取班级联列表 -->
		<view class="class-list">
			<button @click="goToClassListPage">获取班级列表</button>
		</view>
		<!-- 查询班级信息 -->
		<view class="user-list">
			<button @click="toQueryClassInfo">查询班级信息</button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onMounted
	} from 'vue'
	import userApi from '@/api/user.js'


	const goToClassListPage = () => {
		uni.navigateTo({
			url: '/pages/class/class-list'
		})
	}
	const toQueryClassInfo = () => {
		uni.navigateTo({
			url: '/pages/class/query-class'
		})
	}
</script>

<style lang="scss">
	.container {
		padding: 30px;
	}

	.popup-container {
		background-color: #ffffff;
		border-radius: 10px;
		overflow: hidden;
		width: 400px;
		margin: 0 auto;
	}

	.popup-header {
		background-color: #f8f8f8;
		padding: 15px;
		text-align: center;
	}

	.popup-title {
		font-size: 18px;
		font-weight: bold;
	}

	.popup-body {
		padding: 20px;

		input,
		picker {
			width: 95%;
		}
	}

	.input-field {
		width: 100%;
		padding: 10px;
		margin-bottom: 10px;
		border: 1px solid #ddd;
		border-radius: 5px;
	}

	.picker-field {
		padding: 10px;
		border: 1px solid #ddd;
		border-radius: 5px;
		margin-bottom: 10px;
	}

	.picker-label {
		font-size: 16px;
	}

	.popup-footer {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px;
	}

	.confirm-button,
	.cancel-button {
		padding: 10px 20px;
		border-radius: 5px;
		font-size: 16px;
	}

	.confirm-button {
		background-color: #007aff;
		color: #ffffff;
	}

	.cancel-button {
		background-color: #ff3b30;
		color: #ffffff;
	}
</style>